<script type="text/javascript">

//upload file


$(document).ready(function(){
	
	$('#update-profile a').click(function (e) {
	  e.preventDefault();
	  $(this).tab('show');
	});

	$('#path_img').change(function(e){
		//return ajaxFileUpload();
		//$('#avatar').setattribute("src", this.value);
	});

	$('#gender').change(function (e){
		alert(this.value);
		});
});

function checkdata()
{
	var result = true;
	var message = "";
	if($("#first-name").val().length ==0){
		result = false;
		message += "Please input first name\n";
	}
	if($("#middle-name").val().length ==0){
		result = false;
		message += $("#check-middle-name").val() + "\n";
	}
	if($("#check-last-name").val().length ==0){
		result = false;
		message += $("#check-last-name").val() + "\n";
	}
	
	if(message.length != 0)
	{
		alert(message);
	}	
	return result;
}
</script>

<ul id="update-profile" class="nav nav-tabs">
	<li class="active"><a href="#profile" data-toggle="tab">Profile</a></li>
	<li><a href="#paper_setting" data-toggle="tab">Paper-setting</a></li>
	<li><a href="#add_friend" data-toggle="tab">Add Friend</a></li>            
</ul>

<div id="profile-content" class="tab-content">
	<div class="tab-pane fade in active" id="profile">
		<h1>profile</h1>
		<?php $id = Yii::app()->user->getId()->id;?>
		<form class="form-horizontal" id="frm-update-profile" action="/nsn/updateProfile2" method="POST">
        <fieldset>
          <div class="control-group">
            <label class="control-label" for="first-name">First Name</label>
            <div class="controls">
              <input type="text" class="input-xlarge" id="first-name" name="UserProfile[first_name]" onchange="checkvalid('first-name','check-first-name','Invalid value');">
              <div id="check-first-name" class="nsn-error"></div>              
            </div>
          </div>
          <div class="control-group">
            <label class="control-label" for="middle-name">Middle Name</label>
            <div class="controls">
              <input type="text" class="input-xlarge" id="middle-name" name="UserProfile[middle_name]" onchange="checkvalid('middle-name','check-middle-name','Invalid value');">
              <div id="check-middle-name" class="nsn-error"></div>              
            </div>
          </div>
          
          <div class="control-group">
            <label class="control-label" for="last-name">Last Name</label>
            <div class="controls">
              <input type="text" class="input-xlarge" id="last-name" name="UserProfile[last_name]" onchange="checkvalid('last-name','check-last-name','Invalid value');">
              <div id="check-last-name" class="nsn-error"></div>              
            </div>
          </div>
                           
          <div class="control-group">
            <label class="control-label pull-left" for="gender">Gender</label>
            <div class="controls">
              <select id="gender" name="UserProfile[gender]">
                <option value="0">Male</option>
                <option value="1">Female</option>            
              </select>
            </div>
          </div>
          
          <div class="control-group" id='uploadimg'>
            <label class="control-label" for="avatar">Avatar</label>
            <div class="controls">              
              <img class="thumbnail" id="avatar" name="avatar" src="http://placehold.it/165x140" alt="">
              <input type="file" class="input-file" id="path_img"/>              
            </div>            
          </div>
          
          <div class="control-group">
            <label class="control-label" for="textarea">Note</label>
            <div class="controls">
              <textarea class="input-xlarge" id="textarea" rows="3" name="UserProfile[middle_name]"></textarea>
            </div>
          </div>
          
          <div class="form-actions">
            <button type="submit" class="btn btn-primary" id ="submit">Save changes</button>
            <button class="btn">Reset</button>
          </div>
        </fieldset>
      </form>
	</div>
	<div class="tab-pane fade" id="paper_setting">
		<p>paper setting</p>
	</div>
	<div class="tab-pane fade" id="add_friend">
		<p>add friend</p>
	</div>            
</div>